<template>
  <div class="LetTop">
    <div class="headerMaintitle">
      <img class="topPic" src="../assets/rightBottom3.png" alt="" />
      <div class="headerText">标题1</div>
    </div>
    <div class="countDiv">
      <div class="countItem">
        <img src="../assets/orangeBg1.png" alt="" />
        <span class="count">15</span>
        <span class="title">总数</span>
      </div>
      <div class="countItem">
        <img src="../assets/orangeBg2.png" alt="" />
        <span class="count">15</span>
        <span class="title">在线</span>
      </div>
      <div class="countItem">
        <img src="../assets/orangeBg3.png" alt="" />
        <span class="count">0</span>
        <span class="title">离线</span>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  name: "LetTop",
  props: {},
  data() {
    return {
      dataList: [],
    };
  },
  computed: {},
  watch: {},
  methods: {},
  beforeCreate() {},
  created() {},
  beforeMount() {},
  mounted() {},
  updated() {},

  activated() {},
  deactivated() {},
  beforeDestroy() {},
  destroyed() {},
};
</script>
<style lang="less" scoped>
.LetTop {
  .countDiv {
    margin-top: 40px;
    display: flex;
    .countItem {
      cursor: pointer;
      position: relative;
      width: 33%;
      img {
        width: 100%;
      }
      .count {
        position: absolute;
        font-size: 42px;
        font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
        font-weight: 800;
        color: #010a1e;
        line-height: 28px;
        background: linear-gradient(360deg, #1dbaff 0%, #00ffea 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        top: 24px;
        left: 50%;
        transform: translateX(-50%);
      }
      .title {
        font-size: 24px;
        font-family: AlibabaPuHuiTi, AlibabaPuHuiTi;
        font-weight: bold;
        color: #fff;
        line-height: 30px;
        position: absolute;
        bottom: 32px;
        left: 50%;
        transform: translateX(-50%);
        span {
          font-size: 14px;
        }
      }
    }
  }
}
</style>
